<template>
  <div>{{ count }}</div>
  <ul>
    <li v-for="item in list" :key="item.menuId">{{ item.name }}</li>
  </ul>
</template>

<script>
import { defineComponent, ref, reactive, toRefs, onMounted } from 'vue'
import api from '../../api/index'
export default defineComponent({
  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
  setup () {
    const count = ref(88)
    const state = reactive({
      list: []
    })
    count.value = 66
    onMounted(async () => {
      const res = await api.menu.menu({ type: 'post' })
      const { result } = res
      state.list = result
    })
    return {
      count,
      ...toRefs(state)
    }
  }
})
</script>

<style lang="scss" scoped></style>
